<template>
  <div>
    <el-dialog :visible.sync="dialogVisible" width="1000px">
      <template slot="title">
        <div class="tishi">
          <span>积分明细</span>
        </div>
      </template>
      <div style="margin-bottom: 10px" class="tiem_class_flex">
        <span>变动时间</span>
        <div class="tiem_class">
          <div>
            <el-date-picker
              format="yyyy-MM-dd HH:mm:ss"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              placeholder="开始日期"
              v-model="value1_start"
              style="width: 185px"
              @change="dateFun"
            ></el-date-picker>
          </div>
          <div class="tiem_class_line">-</div>
          <div>
            <el-date-picker
              format="yyyy-MM-dd HH:mm:ss"
              value-format="yyyy-MM-dd HH:mm:ss"
              default-time="23:59:59"
              type="datetime"
              placeholder="结束时间"
              v-model="value1_end"
              style="width: 185px"
              @change="dateFun"
            ></el-date-picker>
          </div>
        </div>
      </div>
      <div class="">
        <el-table
          :data="tableData"
          class="tableStyle"
          :header-cell-style="$headerCellStyle"
          :border="$isborder"
          stripe
          size="mini"
        >
          <el-table-column prop="key" label="序号" label-class-name="indexColumn" :width="$widtha" align="center" fixed="left"> </el-table-column>
          <el-table-column label="类型" prop="type" :width="$widthb" align="left"> </el-table-column>
          <el-table-column prop="score" label="积分" :width="$widtha" align="left"> </el-table-column>
          <el-table-column prop="intro" label="内容" align="left" :min-width="$widthc" show-overflow-tooltip>
          </el-table-column>
          <el-table-column prop="create_time" label="创建时间" :width="$widthb" show-overflow-tooltip align="left">
          </el-table-column>
        </el-table>
      </div>

      <div slot="footer">
        <footer class="pagination">
          <div>
            <el-pagination
              background
              prev-text="上一页"
              next-text="下一页"
              layout="prev, pager, next, jumper"
              :total="listTotal"
              :page-size="10"
              @current-change="handleCurrentChange"
              :current-page.sync="currentPage1"
            >
            </el-pagination>
            
          </div>
          <p>
            共
            <span>{{ listTotal || 0 }}</span>
            数据
          </p>
        </footer>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "AdminIntegralsubsidiary",

  data() {
    return {
      dialogVisible: false,
      tableData: [],
      page: 1,
      listTotal: 0,
      currentPage1: 1,
      tiemvalue: [],
      row: {},
      value1_start: "",
      value1_end: "",
    }
  },
  mounted() {},

  created() {},
  activated() {
    this.value1_start = ""
    this.value1_end = ""
    this.page = 1
    this.tableData = []
    this.listTotal = 0
    this.currentPage1 = 1
  },
  methods: {
    dateFun() {
      if (this.value1_start && this.value1_end) {
        if (this.timeSlotValidator(this.value1_start, this.value1_end)) {
          this.getList()
        } else {
          return
        }
      }
    },
    isshow(value) {
      console.log(value)
      this.row = value
      this.dialogVisible = true
      this.tiemvalue = []
      this.getList()
    },
    async getList() {
      try {
        let res = await this.request({
          url: "/admin/scoreInfo/scoreLog",
          method: "get",
          loading: true,
          data: {
            account_id: this.row.account_id ? this.row.account_id : "",
            page: this.page,
            limit: 10,
            keywords: "",
            start_time: this.value1_start,
            end_time: this.value1_end,
          },
        })
        if (res) {
          this.tableData = res.content.data
          this.listTotal = res.content.total
          this.currentPage1 = res.content.current_page
        }
      } catch (err) {
        let error = err.message.split("/")
        if (error[0] == 203) {
          this.tableData = []
          this.listTotal = 0
        }
        console.log(err)
        this.errorHandler(err)
      }
    },
    //分页
    handleCurrentChange(val) {
      this.page = val
      this.getList()
    },
    tiemChang() {
      this.tiemvalue = this.tiemvalue == null ? [] : this.tiemvalue
      this.getList()
    },
  },
}
</script>

<style lang="scss" scoped>
.pagination {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  // justify-content: space-between;
  background-color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  margin-bottom: 30px;
  > p {
    font-size: 12px;
    font-family: MicrosoftYaHei;
    text-align: left;
    color: $textColorF;
    margin-left: 20px;
    margin-right: 25px;
    > span {
      color: $themeColorponti;
      padding: 0 4px;
    }
  }
  > div {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    margin-right: 20px;
    > .pagination_go {
      margin-left: 20px;
    }
  }
}
.tiem_class {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.tiem_class_line {
  margin: 0 7px;
}
.tiem_class_flex {
  display: flex;
  flex-direction: row;
  align-items: center;
  > span {
    margin-right: 10px;
  }
}
</style>
